<div class="deploy_body">
<table class="list">
    <thead>
    <tr>
        <td style="width: 80px;"></td>
        <td style="width: 160px;text-align: center;"><?php echo $this->language->get('text_select_region');?></td>
        <!--<td style="width: 160px;text-align: center;"><?php echo $this->language->get('text_select_hd');?></td>-->
        <td style="width: 160px;text-align: center;"><?php echo $this->language->get('text_select_network');?></td>
        <td style="width: 597px; text-align: center;"><?php echo $this->language->get('text_server_config_info');?></td>
        <td style="text-align: center;"><?php echo $this->language->get('button_edit');?></td>
    </tr>
    </thead>
    <tbody>
    <?php foreach ($products as $product) { ?>
    
     <!--region selected start 
     <thead style="height: 50px; line-height: 20px;">
       <tr>
           <td>云区域<span class="help" style="color: #000000;">不同的云区域决定了公有云的能力，目前只支持青云</span></td>
           <td>管理员密码<span class="help" style="color: #000000;">服务器的管理员密码,仅用于此次部署的服务器
             (Windows帐号为<strong>administrator</strong>,ubuntu账号为<strong>ubuntu</strong>，linux为<strong>root</strong>)</span></td>
       </tr>
       </thead>
       <tr>
           <td>
               <select name="region">
                   <?php foreach($regions as $region ){ ?>
                   <option value="<?php echo $region['value'];?>"><?php echo $region['name'];?></option>
                   <?php } ?>
               </select>
           </td>
           <td>
               <input type="text" name="super_password" id="password1" value="<?php echo $super_password;?>" /><span class="required">*</span>
           </td>       
       </tr>
    -->

    <tr>
        <td class="name" align="center">
            <a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" /></a><br/>
            <?php echo $product['name']; ?>
        </td>
        
        <td>
        <div class="private" id="checkout_basic">
      
         <select id="region-select<?php echo $product['product_id']; ?>" name="region[<?php echo $product['product_id']; ?>]" class="select_region" for="subnet-<?php echo $product['product_id']; ?>" aid="<?php echo $product['product_id']; ?>">
                   <?php foreach($product['regions'] as $item ){ ?>
                    <?php if($product['region']==$item['value']){ ?>
                                 <option value="<?php echo $item['value'];?>" selected="selected"><?php echo $item['name'];?></option>
                  
                       <?php } else{   ?>
                               <option value="<?php echo $item['value'];?>"><?php echo $item['name'];?></option>
                       <?php } ?>
                   <?php } ?>
         </select>
         <!--
         <br/>
         <div id="checkout-content">
          <span>管理员密码</span>
          <input type="text" name="super_password" id="password1-<?php echo $product['product_id']; ?>" value="" class="input_password"/>
         </div>
          -->
        </div>
        </td>
        <!--
         <td>
        <div class="private" id="checkout_basic">
      
         <select id="hd-select<?php echo $product['product_id']; ?>" name="hd[<?php echo $product['product_id']; ?>]" class="select_hd"  aid="<?php echo $product['product_id']; ?>">
                  <option value="hd_default"><?php echo $this->language->get('text_select_hd');?></option>
                   <?php foreach($hd_info as $key){ ?>
                       <?php if($product['hd_name']==$key){ ?>
                                 <option value="<?php echo $key;?>" selected="selected"><?php echo $key;?></option>
                       <?php } else{   ?>
                                <option value="<?php echo $key;?>"><?php echo $key;?></option>
                       <?php } ?>
                   <?php } ?>
                   <option value="hd_creat" style="font-weight:bold;"><?php echo $this->language->get('text_create_hd');?></option>
         </select>
        
        </div>
        </td>-->
        
        <td>
           <div class="private" id="private-<?php echo $product['product_id'];?>">
               <select id="vpc-select<?php echo $product['product_id']; ?>" name="vpc[<?php echo $product['product_id']; ?>]"  class="select_vpc" for="subnet-<?php echo $product['product_id']; ?>" aid="<?php echo $product['product_id']; ?>">
                   <option value="vpc_default"><?php echo $this->language->get('text_select_vpc');?></option>
                   <?php foreach($vpc_info as $key => $vpc){ ?>
                       <?php if($product['vpc_name']==$key){ ?>
                                 <option value="<?php echo $key;?>" selected="selected"><?php echo $key;?></option>
                       <?php } else{   ?>
                                <option value="<?php echo $key;?>"><?php echo $key;?></option>
                       <?php } ?>
                   <?php } ?>
                   <option value="vpc_creat" style="font-weight:bold;"><?php echo $this->language->get('text_create_vpc');?></option>
               </select><span class="required">*</span>
               <br/>
               <div id="subnet-<?php echo $product['product_id']; ?>" class="subnet_block" aid="<?php echo $product['product_id']; ?>">
               <?php foreach($vpc_info as $key => $vpc){ ?>
                   <?php if($product['vpc_name']==$key){
                            $css_str='';
                   }else{
                            $css_str='style="display:none;" disabled="disabled"';
                   }
                   ?>
                   <select class="<?php echo $key;?>" name="subnet[<?php echo $product['product_id']; ?>]" <?php echo $css_str;?> aid="<?php echo $product['product_id']; ?>">
                       <option value="subnet_default"><?php echo $this->language->get('text_select_subnet');?></option>
                       <?php foreach($vpc as $subnet){ ?>
                       <?php
                                if($product['subnet_name']==$subnet){
                                    $selected_str='selected="selected"';
                                }else{
                                    $selected_str='';
                                }?>
                           <option value="<?php echo $subnet;?>" <?php echo $selected_str;?>><?php echo $subnet;?></option>
                           <?php } ?>
                           <option  value="subnet_creat" style="font-weight:bold;"><?php echo $this->language->get('text_create_vpc');?></option>

                   </select>
               <?php } ?>
                   <?php if($product['vpc_name']){ ?>
                           <select name="subnet[<?php echo $product['product_id']; ?>]" class="vpc_default" style="display: none;" disabled="disabled">
                                <option value=""><?php echo $this->language->get('text_select_vpc_first');?> </option>
                           </select>
                            <span class="required">*</span>
                   <?php }else{ ?>
                   <select name="subnet[<?php echo $product['product_id']; ?>]" class="vpc_default">
                       <option value=""><?php echo $this->language->get('text_select_vpc_first');?> </option>
                   </select>
                   <span class="required">*</span>
                    <?php } ?>
               </div>
           </div>
        </td>
        <td style="width: 180px;">
        <div class="app_set_config" id="app_set_config-<?php echo $product['product_id'];?>">
            <!--
            <section><label>主机:</label><span id="parameter_host-<?php echo $product['product_id'];?>"></span></section>
            <section><label>OS:</label><span id="parameter_os-<?php echo $product['product_id'];?>"></span></section>
            <section><label>数据库名称:</label><span id="parameter_mysql_db_name-<?php echo $product['product_id'];?>"></span></section>
            <section><label>数据库账户:</label><span id="parameter_mysql_db_user-<?php echo $product['product_id'];?>"></span></section>

            -->
            <section  id="deploy-info-<?php echo $product['product_id'];?>">
                    <?php if($product['deploy_app_info']) { ?>
                            <ul>
                                <?php foreach($product['deploy_app_info']['result'] as $key => $deploy_app_info){ ?>
                                        <li><lable><?php echo $key;?> </lable><span><?php echo $deploy_app_info;?></span></li>
                                <?php } ?>
                            </ul>
                    <?php }else{ ?>
                            <?php echo $this->language->get('text_deploy_info_noset');?>
                     <?php } ?>
            </section>
        </div>
        </td>
        <td style="text-align: center">
            <button type="button" id="lock_for_app-<?php echo $product['product_id']; ?>"  class="btn  btn-primary " onclick="app_config(<?php echo $product['product_id'];?>)" aria-hidden="true"><i class="icon-ok"></i><?php echo $this->language->get('button_set');?></button>
        </td>
    </tr>
    <div id="hd_form-<?php echo $product['product_id'];?>"class="lightbox_block"></div>
    <div id="vpc_form-<?php echo $product['product_id'];?>"class="lightbox_block"></div>
    <div id="subnet_form-<?php echo $product['product_id'];?>" class="lightbox_block"></div>
    <div id="appconfig_form-<?php echo $product['product_id'];?>" class="lightbox_block"></div>
    
    <?php } ?>
    </tbody>
</table>


<div class="buttons">
    <div class="right">
        <input type="button" value="<?php echo $this->language->get('button_continue');?>" id="button-configure" class="button" />
    </div>
</div>
</div>
<script>

    $(function(){
         
		$('.select_region').each(function(){
			var app_id=$(this).attr('aid');
			 $('#hd-select'+app_id).empty();
			$('#vpc-select'+app_id).empty();
           $('#subnet-'+app_id).html('');
    		$.post("index.php?route=deploy/app/get_vpc_by_region",
            {
                app_id:app_id,
                region:$('#region-select'+app_id).val()
            },
            function(json){
                json=JSON.parse(json);
              
              $('#hd-select'+app_id).append("<option value=\"hd_default\"><?php echo $this->language->get('text_select_hd');?></option>");
			  $('#hd-select'+app_id).append(json['hd']);
			  $('#hd-select'+app_id).append("<option value=\"hd_creat\" style=\"font-weight:bold;\"><?php echo $this->language->get('text_create_hd');?></option>");
              //end of harddisk   
                
              $('#vpc-select'+app_id).append("<option value=\"vpc_default\"><?php echo $this->language->get('text_select_vpc');?></option>");
			  $('#vpc-select'+app_id).append(json['vpc']);
			  $('#vpc-select'+app_id).append("<option value=\"vpc_creat\" style=\"font-weight:bold;\"><?php echo $this->language->get('text_create_vpc');?></option>");

                $('#subnet-'+app_id).append(json['subnet']);
                if(json['subnet']){
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']" disabled="disabled" style="display:none;"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }else{
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }
                $('#subnet-'+app_id).append('<span class="required">*</span>');


            });
	  	});
		 
		
	
        //remove all added block
        $("#container").nextAll().remove()
        

		
        //change region
         $(document).off("change", ".select_region" );
        $(document).on('change', '.select_region', function() {
           var app_id = $(this).attr("aid");
           $('#hd-select'+app_id).empty();
           $('#vpc-select'+app_id).empty();
           $('#subnet-'+app_id).html('');
            $.post("index.php?route=deploy/app/get_vpc_by_region",
            {
                app_id:app_id,
                region:$('#region-select'+app_id).val()
            },
            function(json){
                json=JSON.parse(json);
              //harddisk
              $('#hd-select'+app_id).append("<option value=\"hd_default\"><?php echo $this->language->get('text_select_hd');?></option>");
			  $('#hd-select'+app_id).append(json['hd']);
			  $('#hd-select'+app_id).append("<option value=\"hd_creat\" style=\"font-weight:bold;\"><?php echo $this->language->get('text_create_hd');?></option>");
              //end of harddisk  
              
              $('#vpc-select'+app_id).append("<option value=\"vpc_default\"><?php echo $this->language->get('text_select_vpc');?></option>");
			  $('#vpc-select'+app_id).append(json['vpc']);
			  $('#vpc-select'+app_id).append("<option value=\"vpc_creat\" style=\"font-weight:bold;\"><?php echo $this->language->get('text_create_vpc');?></option>");

                $('#subnet-'+app_id).append(json['subnet']);
                if(json['subnet']){
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']" disabled="disabled" style="display:none;"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }else{
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }
                $('#subnet-'+app_id).append('<span class="required">*</span>');


            });

        });
        
        
        
          
        //end of region
        //change harddisk
        $(document).off("change", ".select_hd" );
        $(document).on('change', '.select_hd', function() {
            if($(this).val()=="hd_creat"){
                creat_hd($(this).attr("aid"));
            }else  if($(this).val()=="hd_edit"){
                edit_hd($(this).attr("aid"));
            }

        });
        //end of harddisk
        
        
        //change vpc&subnet
        $(document).off("change", ".select_vpc" );
        $(document).on('change', '.select_vpc', function() {
            if($(this).val()=="vpc_creat"){
                creat_vpc($(this).attr("aid"));
            }else  if($(this).val()=="vpc_edit"){
                edit_vpc($(this).attr("aid"));
            }else{
                var subnet_object=$(this).val();
                var app_id = $(this).attr("aid");
                 $('#subnet-'+app_id).html('');
                 $.post("index.php?route=deploy/app/get_subnet_by_vpc",
		            {
		                app_id:app_id,
		                vpc_name:subnet_object,
		                region:$('#region-select'+app_id).val()
		            },
            	function(json){
                json=JSON.parse(json);
                //add subnet div
                $('#subnet-'+app_id).append(json['subnet']);
                if(json['subnet']){
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']" disabled="disabled" style="display:none;"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }else{
                    $('#subnet-'+app_id).append('<select class="vpc_default" name="subnet['+app_id+']"><option value=""><?php echo $this->language->get('text_select_vpc_first');?></option></select>');
                }
                $('#subnet-'+app_id).append('<span class="required">*</span>');
                //end of subnet div
                
                $("#"+$(this).attr('for')+" :input").attr("disabled",true);
                $("#"+$(this).attr('for')+" :input").hide();
                $("#"+$(this).attr('for')+" ."+subnet_object).show();
                $("#"+$(this).attr('for')+" ."+subnet_object).attr("disabled",false);
                
                });
                
               
            }

        });
        //creat subnet
        $(document).off("change", ".subnet_block select" );
        $(document).on('change', '.subnet_block select', function() {
            if($(this).val()=="subnet_creat"&&$(this).attr("aid")!=""){
                creat_subnet($(this).attr("aid"));
            }else if($(this).val()=="subnet_edit"&&$(this).attr("aid")!="" ){
                edit_subnet($(this).attr("aid"));
            }
            
           
        });
    });
    
    //create&edit hard-disk
    function creat_hd(app_id){
        $.post("index.php?route=deploy/hd/",
            {
                app_id:app_id,
                region:$('#region-select'+app_id).val()
            },
            function(html){
                $('#hd_form-'+app_id).html(html)
            });
            $('#hd_form-'+app_id).lightbox_me({
                centered: true
            });
    }
    
     function edit_hd(app_id){
        $.post("index.php?route=deploy/hd/edit/",
                {
                    app_id:app_id,
                    region:$('#region-select'+app_id).val()
                },
                function(html){
                    $('#hd_form-'+app_id).html(html)
                });
        $('#hd_form-'+app_id).lightbox_me({
            centered: true
        });
    }
    
    //end of hd related
    
    
    function creat_vpc(app_id){
        $.post("index.php?route=deploy/vpc/",
            {
                app_id:app_id,
                region:$('#region-select'+app_id).val()
            },
            function(html){
                $('#vpc_form-'+app_id).html(html)
            });
            $('#vpc_form-'+app_id).lightbox_me({
                centered: true
            });
    }
    function edit_vpc(app_id){
        $.post("index.php?route=deploy/vpc/edit/",
                {
                    app_id:app_id,
                    region:$('#region-select'+app_id).val()
                },
                function(html){
                    $('#vpc_form-'+app_id).html(html)
                });
        $('#vpc_form-'+app_id).lightbox_me({
            centered: true
        });
    }
    function creat_subnet(app_id){
        if($('#vpc-select'+app_id).val()=="vpc_default"){
            alert("<?php echo $this->language->get('error_unset_network');?>");
            return false;
        }
        if($('#vpc-select'+app_id).val()==""){
            return false;
        }
        $.post("index.php?route=deploy/subnet/",
                {
                    app_id:app_id,
                    vpc_name:$('#vpc-select'+app_id).val(),
                    region:$('#region-select'+app_id).val()
                },
                function(html){
                    $('#subnet_form-'+app_id).html(html)
                });
        $('#subnet_form-'+app_id).lightbox_me({
            centered: true
        });
    }
    function edit_subnet(app_id){
        $.post("index.php?route=deploy/subnet/edit/",
                {
                    app_id:app_id,
                    vpc_name:$('#vpc-select'+app_id).val(),
                    region:$('#region-select'+app_id).val()
                },
                function(html){
                    $('#subnet_form-'+app_id).html(html)
                });
        $('#subnet_form-'+app_id).lightbox_me({
            centered: true
        });
    }
    function app_config(app_id){
        
        /*
    	$.ajax({
        url: 'index.php?route=deploy/basic/validate',
        type: 'post',
        async: false,
        data: $('#checkout_basic input[type=\'text\'], #checkout_basic input[type=\'password\'], #checkout_basic input[type=\'checkbox\']:checked, #checkout_basic input[type=\'radio\']:checked, #checkout_basic input[type=\'hidden\'], #checkout_basic select'),
        dataType: 'json',
        beforeSend: function() {
            $('#button-basic').attr('disabled', true);
            $('#button-basic').after('<span class="wait">&nbsp;<img src="catalog/view/theme/default/image/loading.gif" alt="" /></span>');
        },
        complete: function() {
            $('#button-basic').attr('disabled', false);
            $('.wait').remove();
        },
        success: function(json) {
            $('.warning, span.error').remove();
            if (json['redirect']) {
                location = json['redirect'];
            } else if (json['error']) {
                if (json['error']['warning']) {
                    $('#checkout_basic .checkout-content').prepend('<div class="warning" style="display: none;">' + json['error']['warning'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>');
                    $('.warning').fadeIn('slow');
                }
                if (json['error']['super_password']) {
                     alert("请输入管理密码！");
                    $('#checkout_basic input[name=\'super_password\']').next().after('<span class="error">' + json['error']['super_password'] + '</span>');
                    return false;
                }
               
            } else {
                
             
            }
        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
    });
    */
    	

        if($('#vpc-select'+app_id).val()=="vpc_default"){
            alert("<?php echo $this->language->get('error_unset_network');?>");
            return false;
        }
        if($("#subnet-"+app_id+" ."+$('#vpc-select'+app_id).val()).val()=="subnet_default"||$("#subnet-"+app_id+" ."+$('#vpc-select'+app_id).val()).val()=="subnet_edit"){
            alert("<?php echo $this->language->get('error_unset_network');?>");
            return false;
        }
       
        $('#appconfig_form-'+app_id).lightbox_me({
            centered: true,
            onLoad: function(){
                        $.post("index.php?route=deploy/app_config/",{
                            region:$('#region-select'+app_id).val(),
                            super_password:$("input[name='super_password']").val(),
                            app_id:app_id,
                            vpc_name:$('#vpc-select'+app_id).val(),
                            app_name:$("input[name='appname["+app_id+"]']").val(),
                            subnet_name:$("#subnet-"+app_id+" ."+$('#vpc-select'+app_id).val()).val()
                        },
                        function(html){
                            $('#appconfig_form-'+app_id).html(html)
                        });
            }
        });
    }
</script>